<template>
  <div class="hello">
    <nav>
      <router-link to="/home" class="nav">首页</router-link>
      <router-link to="/class" class="nav">分类</router-link>
      <router-link to="/artist" class="nav">艺术家</router-link>
      <router-link to="/login_car" class="nav">购物车</router-link>
      <router-link to="/login" class="nav">我</router-link>
    </nav>
    <router-view />
  </div>
</template>
<script>
export default{
  name: '',
  data () {
    return {
      car: '/shoppingCar'
    }
  },
  components: {

  }
}
</script>
<style scoped lang="less">
  .hello{
    nav{
      .nav:nth-child(1).router-link-active{
        background-image: url(../assets/img/public/indexs.png);
      }
      .nav:nth-child(2).router-link-active{
        background-image: url(../assets/img/public/fls.png);
      }
      .nav:nth-child(3).router-link-active{
        background-image: url(../assets/img/public/yss.png);
      }
      .nav:nth-child(4).router-link-active{
        background-image: url(../assets/img/public/cars.png);
      }
      .nav:nth-child(5).router-link-active{
        background-image: url(../assets/img/public/mes.png);
      }
    }
  }
</style>